$color-grey: #d9d9d9;
@component-namespace cs {
    @component tabbar {
      background-image:linear-gradient(180deg, $color-grey, $color-grey 50%, transparent 50%);
      background-size: 100% 1px;
      background-repeat: no-repeat;
      background-position: top left;
      position: relative;
      background-color: $tabbar-background-color;
      display: flex;
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      text-align: center;

      @when fixed {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: $z-index-normal;
      }
      
    }
}

.cs-tabbar{
    > .cs-tab-item.is-selected {
        background-color: $tabbar-tab-item-selected-background-color;
        color: $tabbar-tab-item-selected-color;
    }
}
